import React, { Component } from 'react'
import { View, Text, Image } from 'react-native'
import styles from './Detail_style'
import { TouchableOpacity } from 'react-native-gesture-handler'
import { get } from '@/src/utils/http'
import { ICook } from '@/cookbook'
interface Props {
  route?: any,
  navigation?: any

}
interface State {
  detail:any
}

export default class Detail extends Component<Props, State> {
  state = {
    detail:{}
  }

  componentDidMount() {
    this._loadData();
    this.props.navigation.setOptions({
      title: this.props.route.params.title
    })
  }

  async _loadData() {
    let result = await get(`http://192.168.2.1:8088/hotlist/${this.props.route.params.id}`)
    console.log(result)
    this.setState({
      detail:result
    })
  }

  render() {
    return (
      <View style={styles.container}>
        <Image style={styles.mainImg} source={{ uri: this.state.detail.img }}></Image>
        <View style={styles.mainInfo}>

          <View>
    <Text style={styles.mainInfoNma}>{this.state.detail.name}</Text>
          </View>
          <View>
    <Text style={styles.mainInfoSubTitle}>{this.state.detail.all_click}浏览 {this.state.detail.favorites}收藏</Text>
          </View>

          <TouchableOpacity>
            <View style={styles.mainInfoButtonWrap}>
              <Text style={styles.mainInfoButton}>收藏</Text>
            </View>
          </TouchableOpacity>


        </View>
      </View>
    )
  }
}
